﻿<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<link href="${pageContext.request.contextPath}/css/style.css" rel="stylesheet" type="text/css" />
<link href="${pageContext.request.contextPath}/css/table.css" rel="stylesheet" type="text/css" />
<link href="${pageContext.request.contextPath}/dwz/themes/default/style.css" rel="stylesheet" type="text/css" media="screen" />
<link href="${pageContext.request.contextPath}/dwz/themes/css/core.css" rel="stylesheet" type="text/css" media="screen" />
<link rel="stylesheet" href="${pageContext.request.contextPath}/ztree/css/zTreeStyle/zTreeStyle.css" />

<link type="text/css" href="${pageContext.request.contextPath}/jquery/ui/css/ui-lightness/jquery-ui-1.8.18.custom.css" rel="stylesheet" />

<script type="text/javascript" src="${pageContext.request.contextPath}/jquery/jquery-2.1.4.min.js"></script>
<script type="text/javascript"	src="${pageContext.request.contextPath}/jquery/ui/js/jquery-ui-1.8.18.custom.min.js"></script>
<script src="${pageContext.request.contextPath}/ztree/js/jquery.ztree.all.min.js" type="text/javascript"></script>

<script type="text/javascript">
    //集成jquery ztree插件
    var setting = {
        data: {
            simpleData: {
                enable: true
            }
        },
        async:{
            enable: true,
            url:"role?method=getPermissionList&roleId=${role.id}"
        },
    };

    $(function() {
        //集成jquery多tab页
        $('#tabs').tabs();
        $.fn.zTree.init($("#detail_tree"), setting);
    });
</script>

<table border="0" cellpadding="0" cellspacing="0" class="table_border">
    <tr>
        <td>
            <table width="100%" border="0" cellpadding="0" cellspacing="0"
                class="table_right">
                <tr>
                    <td>
                        <font style="font-size: 12px"><strong>角色详细信息</strong></font>
                    </td>
                    <td width="25" height="26" align="right">
                    </td>
                </tr>
            </table>
        </td>
    </tr>
    <tr height="50">
        <td>
            <div id="tabs">
                <ul>
                    <li style="font-size: 12px;">
                        <a href="#tabs-1">角色信息</a>
                    </li>
                    <li style="font-size: 12px;">
                        <a href="#tabs-2">许可信息</a>
                    </li>
                </ul>
                <div id="tabs-1" style="background: #FFFFFF; font-size: 12px;">
                    代码：${role.code}
                    <br />
                    <br />
                    名称：${role.name}
                    <br />
                    <br />
                    描述：${role.remark}
                </div>
                <div id="tabs-2" style="background: #FFFFFF">
                    <table>
                        <tr>
                            <td></td>
                        </tr>
                        <tr>
                            <td>
                                <ul id="detail_tree" class="ztree">
                                </ul>
                            </td>
                        </tr>
                    </table>
                </div>
            </div>
        </td>
    </tr>
</table>
<table width="100%" border="0" cellpadding="0" cellspacing="0"
	class="table_padding">
	<tr>
		<td height="21" align="right">
			<table align="left">
				<tr>
					<td width="50px"><a class="button" href="javascript:void(0)" onclick="window.history.back()"><span>返回</span></a></td>
				</tr>
			</table>
		</td>
	</tr>
</table>
